/*
* @Author: Active code page: 65001
lvhang
* @Date:   2020-11-12 11:14:06
* @Last Modified by:   Active code page: 65001
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
lvhang
* @Last Modified time: 2020-11-24 15:48:25
*/

const gulp = require('gulp');
const htmlmin = require('gulp-htmlmin');
const fileinclude = require('gulp-file-include');
// 引入gulp-less模块
const gulpLess = require('gulp-less');
	// 导入css 压缩模块gulp-csso
	const csso = require('gulp-csso');
		// 实现es6语法的转换的环境！导入模块！
		const babel = require('gulp-babel');
			// 导入js压缩的模块
			const uglify = require('gulp-uglify');
// 使用gulp.task() 方法建立任务 第一个参数是任务的名字！
// 第二个参数是回调函数  执行任务 就是执行对应的回调函数！
gulp.task('first',	done => {
	
	console.log(123)
	// 获取要处理的文件 括号里面的是路径！
	gulp.src('./src/css/base.css')
	// 将处理后的文件输出到dist 目录
		// .pipe 里的代码就是你要处理的代码
		.pipe(gulp.dest('dist/css'))
		done();
})

// html 任务
// 1 html文件中 代码的压缩操作
	// 插件的使用步骤：
		// 1 下载
		// 2 引用
		// 3 调用
// 	2 抽取HTML文件中的公共代码！					
gulp.task('htmlmin', done => {
	// 
	gulp.src('./src/*.html')
		// 顺序很重要 
		// 先把代码公共部分抽取出来 
		// 在进行压缩
		// 最后再进行输出

		// 压缩html文件中的代码！
		.pipe(fileinclude()) // 抽取公共部分 的代码
		.pipe(htmlmin({ collapseWhitespace: true })) // 压缩代码
		.pipe(gulp.dest('dist')) // 输出到新的目录！
		done();
})

// css 任务
// 1 less 语法转换
// 2 css 代码压缩
gulp.task('cssmin', (done) => {
	// 获取所有的less 文件
	// 如何同时选中less文件和css文件呢！ 除了传字符串之外， 还可以传一个数组！

	gulp.src(['./src/css/*.less', './src/css/*.css'])
// 将 less 语法转换成css语法！
		.pipe(gulpLess())
// 压缩css 代码
		.pipe(csso())
		// 把处理的结果保存到dist目录下！将处理的结果进行输出！
		.pipe(gulp.dest('dist/css'))
		// 原因，主要是gulp4.0版本不再支持cssmin解析匿名函数
		// 这里添加一个回调函数cb，指示函数完成
		done()
})

// js任务 
// 1 es6 代码转换
// 2 代码压缩
gulp.task('jsmin', (done) => {
	// 源文件的路径
	gulp.src('./src/js/*.js')
		.pipe(babel({
			// 他可以判断当前代码的运行环境 将代码转换为当前运行环境所支持的代码！
			presets: ['@babel/env']
		})) 
		// 进行js代码压缩!
		.pipe(uglify())
		// 将输出的结果放到dist目录下！
		.pipe(gulp.dest('./dist/js'))
	done();
})

// 任务
// 拷贝文件夹
gulp.task('copy', function(done) {
	gulp.src('./src/images/*')
		.pipe(gulp.dest('./dist/images'));

	gulp.src('./src/lib/*')
		.pipe(gulp.dest('./dist/lib'))
		done();
})

// 需求： 编写一个任务， 其他任务依次执行！
// 构建任务
// 回调函数的写法请参照下面的格式! 用数组来放要执行任务的名称！
gulp.task('default',
 gulp.series(
 	[
 	'htmlmin', 
 	'cssmin', 
 	'jsmin', 
 	'copy'
 	],
 	 async function(done) {
	await console.log(123);
}));






